<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<c:set var="ctx" value="${pageContext.request.contextPath}"/>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>个人设置</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1">

    <link rel="stylesheet" href="${ctx}/css/base.css" type="text/css" />
    <link rel="stylesheet" href="${ctx}/css/common-less.css" type="text/css" />
    <link rel="stylesheet" href="${ctx}/css/moco.min.css" type="text/css" />
    <link rel="stylesheet" href="${ctx}/css/profile-less.css" type="text/css" />
    <jsp:include page="include/commonfiles.jsp"/>
</head>
<body >
<jsp:include page="include/silderbar.jsp"/>
<div class="layui-body" style="align-content: center;background-color: rgb(42,174,103)">
<div id="main" style="align-content: center;background-color: rgb(42,174,103)">
    <div class="page-settings" style="align-content: center;background-color: rgb(42,174,103)">
        <div class="top">
            <div class="w960 mauto top_title">
                <p>个人设置</p>
            </div>
        </div>
        <div class="setting pb10" style="border-radius: 10px;opacity: 0.9" >
            <div class="nav-tabs pa">
                <h class="baseinfo fl active"><a href="${ctx}/personpag">个人设置</a></h>
                <h class="countinfo fl"><a href="${ctx}/myinfo">帐户信息</a></h>
                <div class="cb"></div>
            </div>
            <div class="contentBox">
                <div class="formBox">
                    <div id="setting-profile" class="setting-wrap setting-profile">

                        <div class="wlfg-wrap clearfix ">
                            <label class="label-name" for="job">头像：</label>
                            <div class="rlf-group">
<%--                                <img class="fl avator-img" id="my-img" src="${fileurl}" data-portrait="58492fe600012e8e01800180" width="180" height="180">--%>
                                <div class="fl ml20 pr">
<%--                                    <div><input type="button" hidefocus="true" value="换一换" class="js-avator-try avator-try"></div>--%>
                                    <div id="avator-btns" class="avator-btn-inner">
                                        <div class="avator-btn-wrap">
                                            <form action="${ctx}/images/uploadimg" id="imgform" method="post" enctype="multipart/form-data">
                                                <input class="hide" name="fileup" id="file_upload" type="file" style="height: 48px; opacity: 0.6;" />
                                                <input name="host" value="${userInfo.username}" type="hidden">
                                                <button class="btn btn-default btn-xs btn-success" type="submit" style="width: 35px;height: 25px;width: 72px;border-radius: 8%;opacity: 0.5;">上传</button>
                                            </form>
                                        </div>
                                        <img class="fl avator-img" id="my-img" src="${fileurl}" width="180" height="180">
                                    </div>
                                </div>
                                <div class="cb"></div>
                                <p class="rlf-tip-wrap errorHint color-red" ></p>
                            </div>
                        </div>

                        <form id="profile" action="${ctx}/updateinfo" method="post">

                            <div class="wlfg-wrap clearfix">
                                <label class="label-name" for="nick" >昵称：</label>
                                <div class="rlf-group">
                                    <input type="text" name="nickname" id="nick"  autocomplete="off"  data-validate="require-nick"  class="moco-form-control" placeholder="请输入昵称."/>
                                    <p class="rlf-tip-wrap errorHint color-red" ></p>
                                </div>
                            </div>


                            <div class="wlfg-wrap clearfix">
                                <label class="label-name" for="province-select">城市：</label>
                                <div class="rlf-group">
                                    <select id="province-select" name="localselect" class='moco-form-control' hidefocus="true">
                                        <option value="0">选择省份</option>
                                        <option value="北京">北京</option>
                                        <option value="天津">天津</option>
                                        <option value="河北">河北</option>
                                        <option value="山西">山西</option>
                                        <option value="内蒙古">内蒙古</option>
                                        <option value="辽宁">辽宁</option>
                                        <option value="吉林">吉林</option>
                                        <option value="黑龙江">黑龙江</option>
                                        <option value="上海">上海</option>
                                        <option value="江苏">江苏</option>
                                        <option value="浙江">浙江</option>
                                        <option value="安徽">安徽</option>
                                        <option value="福建">福建</option>
                                        <option value="14">江西</option>
                                        <option value="山东">山东</option>
                                        <option value="河南">河南</option>
                                        <option value="湖北">湖北</option>
                                        <option value="湖南">湖南</option>
                                        <option value="广东">广东</option>
                                        <option value="海南">海南</option>
                                        <option value="广西">广西</option>
                                        <option value="甘肃">甘肃</option>
                                        <option value="陕西">陕西</option>
                                        <option value="新疆">新疆</option>
                                        <option value="青海">青海</option>
                                        <option value="宁夏">宁夏</option>
                                        <option value="重庆">重庆</option>
                                        <option value="四川">四川</option>
                                        <option value="贵州">贵州</option>
                                        <option value="云南">云南</option>
                                        <option value="西藏">西藏</option>
                                        <option value="台湾">台湾</option>
                                        <option value="澳门">澳门</option>
                                        <option value="香港">香港</option>
                                        <option value="其他">其他</option>
                                    </select>
                                    <div class="cb"></div>
                                    <p class="rlf-tip-wrap errorHint color-red"></p>
                                </div>
                            </div>

                            <div class="wlfg-wrap clearfix">
                                <label class="label-name h16 lh16" >性别：</label>
                                <div class="rlf-group rlf-radio-group">
                                    <label  class="lh16"><input type="radio" hidefocus="true" value="未知"   name="sex">保密</label>
                                    <label  class="lh16"><input type="radio" hidefocus="true" value="男"  name="sex">男</label>
                                    <label  class="lh16"><input type="radio" hidefocus="true" value="女" checked="checked" name="sex">女</label>
                                    <p class="rlf-tip-wrap errorHint color-red"></p>
                                </div>
                            </div>

                            <div class="wlfg-wrap clearfix">
                                <label class="label-name" for="aboutme">个性签名：</label>
                                <div class="rlf-group">
                                    <div class="pr">
                                        <textarea name="aboutme"  id="aboutme"  rows="4" class="noresize js-sign moco-form-control"></textarea>
                                        <%--<p class="numCanInput js-numCanInput ">还可以输入128个字符</p>--%>
                                    </div>
                                </div>
                            </div>

                            <div class="wlfg-wrap clearfix">
                                <label class="label-name" for="profile-submit"></label>
                                <div class="rlf-group">
                                    <input type="hidden" name="imageurl" value="${fileurl}"><br>
                                    <button type="submit"class="btn btn-default btn-xs btn-success">保存信息</button>
                                </div>
                            </div>
                        </form>

                    </div>
                </div>
            </div>
        </div>
    </div>

</div>
</div>
<script src="${ctx}/js/jquery-3.6.0.js"></script>
<script>
// 点击头像上传
    $(document).ready(function () {
        $("#my-img").click(function () {
            $("#file_upload").click();
        });
    })
</script>

</body>
</html>